<template>
  <lb-layout
    v-loading="$store.getters.loading"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="#a19f9fb0;"
  >
    <aps-form
      :config="apsForm.formConfig"
      :model="apsForm.formData"
      :formRef="apsForm.formRef"
      :labelWidth="apsForm.labelWidth"
      ref="form"
    ></aps-form>

    <el-descriptions v-if="showTotal" direction="vertical" :column="9" border>
      <el-descriptions-item
        v-for="(item, index) in tagArr"
        :key="index"
        :type="item.type"
        :label="item.label"
      >
        {{ item.value }}{{ item.unit }}
      </el-descriptions-item>
      >
    </el-descriptions>
    <el-table
      class="mt10"
      ref="excelTable"
      :data="tableData.data"
      row-key="deptId"
      default-expand-all
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      border
      :height="580"
    >
      <el-table-column
        prop="deptName"
        label="单位名称"
        minWidth="200"
        align="left"
        showOverflowTooltip
      ></el-table-column>
      <el-table-column
        prop="year"
        label="年份"
        width="100"
        align="center"
        showOverflowTooltip
      ></el-table-column>
      <el-table-column
        prop="roomArea"
        label="用能面积（㎡）"
        width="130"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.roomArea.toFixed(2) }}
        </template>
      </el-table-column>
      <el-table-column
        prop="userNum"
        label="用能人数"
        width="100"
        align="center"
        showOverflowTooltip
      ></el-table-column>
      <el-table-column
        prop="roomNum"
        label="房间数量"
        width="100"
        align="center"
        showOverflowTooltip
      ></el-table-column>
      <el-table-column
        prop="totalElectricConsumption"
        label="总电耗（kwh）"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.totalElectricConsumption.toFixed(2) }}
        </template>
      </el-table-column>
      <el-table-column
        prop=""
        label="用能类型"
        width="300"
        align="center"
        showOverflowTooltip
      >
        <el-table-column
          prop="officeElectric"
          label="办公用能（kwh）"
          width="150"
          align="center"
          showOverflowTooltip
        >
          <template slot-scope="scope">
            {{ scope.row.officeElectric.toFixed(2) }}
          </template>
        </el-table-column>
        <el-table-column
          prop="noOfficeElectric"
          label="非办公用能（kwh）"
          width="160"
          align="center"
          showOverflowTooltip
        ></el-table-column>
        <el-table-column
          prop="specialElectric"
          label="特殊类型（kwh）"
          width="150"
          align="center"
          showOverflowTooltip
        >
          <template slot-scope="scope">
            {{ scope.row.specialElectric.toFixed(2) }}
          </template>
        </el-table-column></el-table-column
      >
      <el-table-column
        prop="publicShareElectricConsumption"
        label="公摊用电（kwh）"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.publicShareElectricConsumption.toFixed(2) }}
        </template></el-table-column
      >
      <el-table-column
        prop="totalWaterConsumption"
        label="总水耗（t）"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.totalWaterConsumption.toFixed(2) }}
        </template></el-table-column
      >
      <el-table-column
        prop="unitBuildingAreaEnergyConsumption"
        label="单位建筑面积能耗（kgce/㎡)"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          <!--          {{ scope.row.unitBuildingAreaEnergyConsumption.toFixed(2) }}-->
          <span
            :class="
              Number(scope.row.unitBuildingAreaEnergyConsumption) > 9.5
                ? 'red'
                : Number(scope.row.unitBuildingAreaEnergyConsumption) > 6
                ? 'yellow'
                : Number(scope.row.unitBuildingAreaEnergyConsumption) > 4
                ? 'blue'
                : 'green'
            "
            >{{ scope.row.unitBuildingAreaEnergyConsumption.toFixed(2) }}</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="perCapitaEnergyConsumption"
        label="人均综合能耗（kgce/p)"
        width="120"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          <span
            :class="
              Number(scope.row.perCapitaEnergyConsumption) > 450
                ? 'red'
                : Number(scope.row.perCapitaEnergyConsumption) > 230
                ? 'yellow'
                : Number(scope.row.perCapitaEnergyConsumption) > 140
                ? 'blue'
                : 'green'
            "
            >{{ scope.row.perCapitaEnergyConsumption.toFixed(2) }}</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="unitBuildingAreaElectricConsumption"
        label="单位建筑面积电耗（kwh/㎡)"
        width="120"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          <span
            :class="
              Number(scope.row.unitBuildingAreaElectricConsumption) > 70
                ? 'red'
                : Number(scope.row.unitBuildingAreaElectricConsumption) > 45
                ? 'yellow'
                : Number(scope.row.unitBuildingAreaElectricConsumption) > 25
                ? 'blue'
                : 'green'
            "
            >{{
              scope.row.unitBuildingAreaElectricConsumption.toFixed(2)
            }}</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="perCapitaElectricConsumption"
        label="人均电耗（kwh/p)"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          <span
            :class="
              Number(scope.row.perCapitaElectricConsumption) > 2300
                ? 'red'
                : Number(scope.row.perCapitaElectricConsumption) > 1700
                ? 'yellow'
                : Number(scope.row.perCapitaElectricConsumption) > 1200
                ? 'blue'
                : 'green'
            "
            >{{ scope.row.perCapitaElectricConsumption.toFixed(2) }}</span
          >
        </template>
      </el-table-column>
      <el-table-column
        prop="perCapitaWaterConsumption"
        label="人均水耗（t/p）"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.perCapitaWaterConsumption.toFixed(2) }}
        </template></el-table-column
      >
      <el-table-column
        prop="gradeEvaluation"
        label="等级评价"
        width="120"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          <span :class="scope.row.gradeEvaluationcolor">
            {{ scope.row.gradeEvaluation }}
          </span>
        </template>
      </el-table-column>
      <!--      <el-table-column-->
      <!--        prop="perCapitaCarbonEmissions"-->
      <!--        label="人均碳排（kgce）"-->
      <!--        width="150"-->
      <!--        align="center"-->
      <!--        showOverflowTooltip-->
      <!--      >-->
      <!--        <template slot-scope="scope">-->
      <!--          {{ scope.row.perCapitaCarbonEmissions.toFixed(2) }}-->
      <!--        </template></el-table-column-->
      <!--      >-->
      <el-table-column
        prop="totalCarbonEmissions"
        label="总碳排（kgCO2）"
        width="150"
        align="center"
        showOverflowTooltip
      >
        <template slot-scope="scope">
          {{ scope.row.totalCarbonEmissions.toFixed(2) }}
        </template></el-table-column
      >

      <!--      <el-table-column-->
      <!--        prop="publicShareWaterConsumption"-->
      <!--        label="公摊用水（t）"-->
      <!--        width="150"-->
      <!--        align="center"-->
      <!--        showOverflowTooltip-->
      <!--      >-->
      <!--        <template slot-scope="scope">-->
      <!--          {{ scope.row.publicShareWaterConsumption.toFixed(2) }}-->
      <!--        </template></el-table-column-->
      <!--      >-->
      <el-table-column
        label="操作"
        align="center"
        fixed="right"
        width="120"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            type="text"
            size="small"
            icon="el-icon-view"
            v-hasPermi="['statistics:dept:detail']"
            @click="toDetail(scope)"
          >
            详情
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- <pagination
      v-show="total > 0"
      :total="total"
      :page-sizes="[20, 40, 60, 80]"
      :page.sync="currentPage"
      :limit.sync="pageSize"
      @pagination="handlerSearchDetail"
    /> -->

    <!-- <lb-table
      ref="excelTable"
      :merge="mergeArr"
      :column="tableData.column"
      :data="tableData.data"
      border
      :height="600"
      pagination
      background
      layout="total, sizes, prev, pager, next, jumper"
      :page-sizes="[20, 40, 60, 80]"
      :pager-count="5"
      :current-page.sync="currentPage"
      :total="total"
      :page-size="pageSize"
      @size-change="handleSizeChange"
      @p-current-change="handleCurrentChange"
    >
    </lb-table> -->
  </lb-layout>
</template>

<script>
import { exportExcel } from "@/utils/xlsx";
import {
  deepClone,
  dealElectricity,
  mul,
  saveQuery,
  outQuery,
  levelCalculate,
} from "@/utils/index";
import CascaderSelect from "@/components/Select/CascaderSelect";
import {
  getDeptStatisticsEnergyUsed,
  getDeptStatisticsEnergyTotal,
} from "@/api/statistics/unit.js";

export default {
  name: "unitStatistics",
  components: {
    CascaderSelect,
  },
  dicts: [],
  data() {
    return {
      fromRouter: "",
      showTotal: false,
      mergeObj: {}, // 用来记录需要合并行的下标
      mergeArr: ["year"],
      tagArr: [
        {
          label: "单位数量",
          value: 0,
          unit: "家",
          type: "success",
        },
        {
          label: "房间数量",
          value: 0,
          unit: "间",
          type: "success",
        },
        {
          label: "用能人数",
          value: 0,
          unit: "人",
          type: "success",
        },
        {
          label: "用能面积",
          value: 0,
          unit: "㎡",
          type: "success",
        },
        {
          label: "总电耗",
          value: 0,
          unit: "kwh",
          type: "danger",
        },
        {
          label: "总水耗",
          value: 0,
          unit: "t",
          type: "danger",
        },
        {
          label: "总碳排",
          value: 0,
          unit: "kgCO2",
          type: "danger",
        },
        // {
        //   label: "公摊用电",
        //   value: 0,
        //   unit: "kwh",
        //   type: "danger",
        // },
        // {
        //   label: "公摊用水",
        //   value: 0,
        //   unit: "吨",
        //   type: "danger",
        // },
        //   {
        //     label: "实际费用：",
        //     value: 0,
        //     unit: "元",
        //     type: "warning",
        //   },
      ],
      areaProps: {
        value: "id",
        children: "children",
        label: "label",
        checkStrictly: true,
        expandTrigger: "hover",
      },
      apsForm: {
        formRef: "form",
        labelWidth: "auto",
        formData: {},
        formConfig: {
          formAttr: {
            inline: true,
            size: "small",
          },
          properties: {
            year: {
              label: "统计年份:",
              typeName: "el-date-picker",
              type: "year",
              size: "small",
              "value-format": "yyyy",
              placeholder: "请选择统计年份",
              clearable: false,
              "picker-options": {
                disabledDate(time) {
                  let date = new Date();
                  return time.getFullYear() > date.getFullYear();
                },
              },
            },
            deptId: {
              label: "单位名称:",
              typeName: "el-select",
              render: (h) => {
                let that = this;
                let valNum = that.$refs?.form?.getFieldsValue().deptId;
                return (
                  <div>
                    <CascaderSelect
                      values={valNum}
                      value={valNum}
                      requestMethod={"get"}
                      varient={"energy"}
                      propOptions={that.areaProps}
                      filterable={true}
                      size={"small"}
                      placeholder={"请选择单位名称"}
                      onInput={(value) => {
                        if (value && value.length > 0) {
                          this.$refs?.form?.setFieldValue(
                            "deptId",
                            value[value.length - 1]
                          );
                        } else {
                          this.$refs?.form?.setFieldValue("deptId", null);
                        }
                      }}
                    ></CascaderSelect>
                  </div>
                );
              },
            },
          },
          formSoltButton: [
            {
              label: "搜索",
              type: "primary",
              typeName: "el-button",
              size: "small",
              icon: "el-icon-search",
              click: this.handlerSearchDetail,
            },
            {
              label: "重置",
              typeName: "el-button",
              size: "small",
              icon: "el-icon-refresh-left",
              click: this.handleReset,
            },
            {
              label: "导出",
              typeName: "el-button",
              plain: true,
              type: "warning",
              size: "small",
              icon: "el-icon-download",
              click: this.handleExport,
            },
          ],
        },
      },
      currentPage: 1,
      pageSize: 20,
      total: 0,
      tableData: {
        column: [
          {
            prop: "year",
            label: "年份",
            width: 100,
            align: "center",
            showOverflowTooltip: true,
          },
          {
            prop: "deptName",
            label: "单位名称",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
          },
          {
            prop: "roomArea",
            label: "用能面积",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "㎡";
              let value = scope.row.roomArea ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "userNum",
            label: "用能人数",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
          },
          {
            prop: "roomNum",
            label: "房间数量",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
          },
          {
            prop: "",
            label: "人均电耗",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "kwh";
              let totalElectric = scope?.row?.perCapitaElectricConsumption ?? 0;
              let userNum = scope?.row?.userNum ?? 0;
              let value;
              if (scope) {
                value = dealElectricity(totalElectric / 1, 1, 2);
              } else {
                value = "0.00";
              }
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "",
            label: "人均水耗",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "t";
              let totalWater = scope?.row?.perCapitaWaterConsumption ?? 0;
              let userNum = scope?.row?.userNum ?? 0;
              let value;
              if (scope) {
                value = dealElectricity(totalWater / 1, 1, 2);
              } else {
                value = "0.00";
              }
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          // {
          //   prop: "",
          //   label: "人均碳排",
          //   minWidth: 100,
          //   align: "center",
          //   showOverflowTooltip: true,
          //   render: (h, scope) => {
          //     let unit = "kgce";
          //     let totalCarbon = scope?.row?.perCapitaCarbonEmissions ?? 0;
          //     let userNum = scope?.row?.userNum ?? 0;
          //     let value;
          //     if (scope) {
          //       value = dealElectricity(totalCarbon / 1, 1, 2);
          //     } else {
          //       value = "0.00";
          //     }
          //     let a = value + unit;
          //     return <div>{a}</div>;
          //   },
          // },
          {
            prop: "totalElectricConsumption",
            label: "总电耗",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "kwh";
              let value = scope?.row?.totalElectricConsumption ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "totalWaterConsumption",
            label: "总水耗",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "t";
              let value = scope?.row?.totalWaterConsumption ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "totalCarbonEmissions",
            label: "总碳排",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "kgce";
              let value = scope?.row?.totalCarbonEmissions ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "publicShareElectricConsumption",
            label: "公摊用电",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "kwh";
              let value = scope?.row?.publicShareElectricConsumption ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          {
            prop: "publicShareWaterConsumption",
            label: "公摊用水",
            minWidth: 100,
            align: "center",
            showOverflowTooltip: true,
            render: (h, scope) => {
              let unit = "t";
              let value = scope?.row?.publicShareWaterConsumption ?? 0;
              value = dealElectricity(value, 1, 2);
              let a = value + unit;
              return <div>{a}</div>;
            },
          },
          // {
          //   prop: "totalFee",
          //   label: "实际费用",
          //   minWidth: 100,
          //   align: "center",
          //   showOverflowTooltip: true,
          //   render: (h, scope) => {
          //     let unit = "元";
          //     let value = scope?.row?.totalFee ?? 0;
          //     value = dealElectricity(value, 1, 2);
          //     let a = value + unit;
          //     return <div>{a}</div>;
          //   },
          // },
          {
            label: "操作",
            width: "120",
            fixed: "right",
            render: (h, scope) => {
              let that = this;
              let a = (
                <el-button
                  type="text"
                  size="small"
                  icon="el-icon-view"
                  v-hasPermi={["statistics:dept:detail"]}
                  onClick={() => {
                    that.$router.push({
                      name: "statisticsUnitDetail",
                      query: {
                        deptId: scope.row.deptId,
                        year: scope.row.year,
                        deptName: scope?.row?.deptName ?? "未知部门",
                      },
                    });
                  }}
                >
                  详情
                </el-button>
              );
              return <div>{a}</div>;
            },
          },
        ],
        data: [],
      },
    };
  },
  created() {
    this.choseFullYear();
  },
  beforeRouteEnter(to, from, next) {
    next((vm) => {
      vm.fromRouter = from?.path ?? "";
    });
  },
  mounted() {},
  methods: {
    // getSummaries(param) {
    //   const { columns, data } = param;
    //   const sums = [];
    //   columns.forEach((column, index) => {
    //     if (index === 0) {
    //       sums[index] = "统计";
    //       return;
    //     }
    //     const values = data.map((item) => Number(item[column.property]));
    //     if (!values.every((value) => isNaN(value))) {
    //       sums[index] = values
    //         .reduce((prev, curr) => {
    //           const value = Number(curr);
    //           if (!isNaN(value)) {
    //             return prev + curr;
    //           } else {
    //             return prev;
    //           }
    //         }, 0)
    //         .toFixed(2);
    //       sums[index] += " ";
    //     } else {
    //       sums[index] = "N/A";
    //     }
    //   });

    //   return sums;
    // },
    flitterData(arr) {
      let spanOneArr = [],
        spanTwoArr = [],
        concatOne = 0;
      arr.forEach((item, index) => {
        if (index === 0) {
          spanOneArr.push(1);
          spanTwoArr.push(1);
        } else {
          // 只需要将 span_name 修改为自己需要合并的字段名即可
          if (item.span_name === arr[index - 1].span_name) {
            //第一列需合并相同内容的判断条件
            spanOneArr[concatOne] += 1;
            spanOneArr.push(0);
          } else {
            spanOneArr.push(1);
            concatOne = index;
          }
        }
      });
      return {
        one: spanOneArr,
      };
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.flitterData(this.tableData.data).one[rowIndex];
        return {
          rowspan: _row,
          colspan: 1,
        };
      }
    },
    toDetail(scope) {
      let obj = {
        deptId: scope.row.deptId,
        year: scope.row.year,
      };
      saveQuery("unitearchQuery", obj);
      this.$router.push({
        name: "statisticsUnitDetail",
        query: {
          deptId: scope.row.deptId,
          year: scope.row.year,
          deptName: scope?.row?.deptName ?? "未知部门",
        },
      });
    },
    handleExport() {
      if (this.tableData.data.length <= 0) {
        this.$message.warning("无内容导出,请确认!");
        return false;
      }
      let fileName = "单位用能统计";
      let cols = [{ wpx: 85 }, { wpx: 240 }];
      exportExcel(this.$refs.excelTable, fileName, cols);
    },
    choseFullYear() {
      let year = new Date().getFullYear();
      year = String(year);
      this.$nextTick(() => {
        let form = {
          ...outQuery("unitearchQuery", this.fromRouter, [
            "/statistics/unit/detial",
          ]),
        };
        if (Object.keys(form).length > 0) {
          this.$refs?.form?.setFieldValue("year", form?.year ?? year);
          this.$refs?.form?.setFieldValue("deptId", form?.deptId ?? null);
        } else {
          this.$refs?.form?.setFieldValue("year", year);
        }
        this.handlerSearchDetail();
      });
    },
    requestTotal(data) {
      let that = this;
      let query = {
        ...data,
      };
      getDeptStatisticsEnergyTotal(query)
        .then((res) => {
          console.log(res);
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          let result = res?.data ?? {};
          this.showTotal = result.deptNum > 1 ? true : false;
          this.tagArr[0].value = result?.deptNum ?? 0;
          this.tagArr[1].value = result?.roomNum ?? 0;
          let userNum = result?.userNum ?? 0;
          this.tagArr[2].value = userNum;
          let totalArea = result?.roomArea ?? 0;
          this.tagArr[3].value = dealElectricity(totalArea, 1, 2);
          let totalElectric = mul(
            result.perCapitaElectricConsumption,
            result.userNum
          );
          let totalWater = mul(
            result.perCapitaWaterConsumption,
            result.userNum
          );
          let totalCarbon = mul(
            result.perCapitaCarbonEmissions,
            result.userNum
          );
          let ele, water, car;
          if (result) {
            ele = dealElectricity(totalElectric / 1, 1, 2);
            water = dealElectricity(totalWater / 1, 1, 2);
            car = dealElectricity(totalCarbon / 1, 1, 2);
          } else {
            ele = "0.00";
            water = "0.00";
            car = "0.00";
          }
          this.tagArr[4].value = ele;
          this.tagArr[5].value = water;
          this.tagArr[6].value = car;
          let publicShareElectricConsumption =
            result?.publicShareElectricConsumption ?? 0;
          let publicShareWaterConsumption =
            result?.publicShareWaterConsumption ?? 0;
          this.tagArr[7].value = dealElectricity(
            publicShareElectricConsumption,
            1,
            2
          );
          this.tagArr[8].value = dealElectricity(
            publicShareWaterConsumption,
            1,
            2
          );
          // let totalFee = result?.totalFee ?? 0;
          // this.tagArr[9].value = dealElectricity(totalFee, 1, 2);
        })
        .catch(() => {
          // this.$message.error("系统错误,请联系管理员!");
        });
    },
    async initData(data) {
      let that = this;
      let query = {
        ...data,
      };
      query.pageNum = that.currentPage;
      query.pageSize = that.pageSize;
      that.$store.commit("app/updateApiCount", "add");
      await getDeptStatisticsEnergyUsed(query)
        .then((res) => {
          that.$store.commit("app/updateApiCount");
          if (res.code === 700) {
            this.$message.warning(res.msg);
            return false;
          }
          that.tableData.data = res?.rows ?? [];
          that.total = res?.total ?? 0;
          that.gradeEvaluationDeal(that.tableData.data);
        })
        .catch((err) => {
          that.$store.commit("app/updateApiCount");
          // this.$message.error("系统错误,请联系管理员!");
        });
    },
    // 递归处理等级评价
    gradeEvaluationDeal(arr) {
      if (arr.length == 0) {
        return;
      }
      arr.map((item) => {
        let result = levelCalculate(
          item.unitBuildingAreaEnergyConsumption,
          item.perCapitaEnergyConsumption
        ); // 等级评价
        item.gradeEvaluation = result.num;
        item.gradeEvaluationcolor = result.color;
        if (item.children) {
          this.gradeEvaluationDeal(item.children);
        }
      });
    },
    // 搜索
    handlerSearchDetail() {
      const { ...other } = this.$refs?.form?.getFieldsValue();
      const data = {
        ...other,
      };
      this.initData(data);
      this.requestTotal(data);
    },
    // 重置
    handleReset() {
      // this.$refs?.form?.setFieldValue("deptId", null);
      this.$refs?.form?.resetFields();
      this.choseFullYear();
    },
    handleSizeChange(val) {
      this.currentPage = 1;
      this.pageSize = val;
      this.handlerSearchDetail();
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      this.handlerSearchDetail();
    },
  },
};
</script>

<style lang="scss" scoped>
.tag-area {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  .el-tag {
    margin-right: 10px;
  }
}
::v-deep .el-descriptions-item__cell {
  text-align: center !important;
}

.red {
  color: #cb0e21;
}
.green {
  color: #0bec81;
}
.blue {
  color: #00afff;
}
.yellow {
  color: #e7ef2b;
}
.gray {
  color: #909399;
}
</style>
